<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/bootstrap4.5.min.css">
    <title>花卉种植</title>
    <style>
        li {
            list-style: none;
        }
        
        ul {
            margin: 0;
            padding: 0;
        }
        
        .row {
            margin: 0;
        }
        
        @media (min-width:576px) {
            .container {
                max-width: 576px;
                padding: 0;
            }
        }
        
        @media (min-width:768px) {
            .container {
                max-width: 768px;
                padding: 0;
            }
        }
        
        @media (min-width:992px) {
            .container {
                max-width: 992px;
                padding: 0;
            }
        }
        
        @media (min-width:1200px) {
            .container {
                max-width: 1200px;
                padding: 0;
            }
        }
        
        .flower {
            padding: 100px 0;
        }
        
        .flower_box img {
            width: 100%;
        }
        
        .flower_box h4 {
            font-size: 20px;
        }
        
        .flower_box span {
            font-size: 14px;
            color: #999999;
        }
        
        .flower_box p {
            color: rgb(153, 153, 153);
            font-size: 14px;
            padding: 40px 0;
        }
        
        .flower_box_img img {
            width: 100%;
        }
        
        .flower_box_img img:nth-child(2) {
            margin-top: 30px;
        }
        
        .flower_box_img_fr {
            display: flex;
            flex-direction: column-reverse;
        }
        
        .flower_box {
            overflow: hidden;
        }
        
        .flower_box:hover img {
            transition: .8s;
            transform: scale(1.2);
            cursor: pointer;
        }
        
        @media(max-width:768px) {
            .flower_box_img img:nth-child(2) {
                margin-top: 0;
            }
            .flower img {
                margin: 10px 0;
            }
        }
    </style>
</head>

<body>
    <div class="flower">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-4 col-12">
                    <div class="flower_box">
                        <h4>移植案例</h4>
                        <span>MIGRATION CASES</span>
                        <p>从种业园林配套资材及花卉.苗木生产供应、景观设计规划到生态工程施工建设的绿色生态产业链。从大型广告,礼仪庆典.演艺表演.庆典物料租赁 节日装饰 等广告礼仪产业链</p>
                        <img src="img/flower/img1.webp" alt="">
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-12">
                    <div class="flower_box_img">
                        <img src="img/flower/img2.webp" alt="">
                        <img src="img/flower/img3.webp" alt="">
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-12">
                    <div class="flower_box_img">
                        <img src="img/flower/img4.webp" alt="">
                        <img src="img/flower/img5.webp" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>